<template>
    <view class="container" :style="themeColor">
        <header-bar :config="config"></header-bar>
        <view class="search-bar-box">
            <search-bar-city
                ref="searchBarCity"
                placeholderText="输入供应商名称"
                @searchFn="searchFn"
                :currentCity="selectCity"
                :param="param"
                :location="location"
                @upFn="upFn"></search-bar-city>
        </view>
        <view class="main">
            <supplier-list v-if="loadOk" :height="listHeight" :requestData="param" :fresh="fresh"></supplier-list>
        </view>
		<privacy-agreement></privacy-agreement>
    </view>
</template>

<script>
import searchBarCity from "@/components/common/search-bar-city.vue"
import supplierList from "@/components/supplier/supplier-list.vue"
import { getElementHeight } from "@/uni-sub-base/utils/elementUtil.js"
import { getLocation, getBatchSmartParse } from "@/uni-sub-base/utils/mapUtil.js"
import { batchSmartParse } from "@/service/api/member.js"
import { getSupplierCarList } from "@/utils/cartUtil.js"
import privacyAgreement from "@/components/privacy-agreement/privacy-agreement.vue"
export default {
    components: {
        searchBarCity,
        supplierList,
		privacyAgreement
    },
    props: {
        visible: {
            type: Boolean,
            default: false,
        },
    },
    data() {
        return {
            config: {
                title: "供应商",
                back: false,
                centerSlot: true,
                barPlaceholder: true,
            },
            fresh: false,
            shopDatas: [],
            listHeight: "500px",
            loadOk: false,
            lbs: null,
            param: {
                cityId: 0,
                address: "",
                lng: 0,
                lat: 0,
                keyword: "",
            },
            location: {
                AddressName: "",
                ContactName: "",
                ContactTel: "",
                ContactAddress: "",
                IsDefault: false,
                ProvinceId: 0,
                ProvinceName: "",
                CityId: 0,
                CityName: "",
                AreaId: 0,
                AreaName: "",
                StreetId: 0,
                StreetName: "",
                ZipCode: null,
            },
            selectCity: "",
            currentCity: "",
        }
    },

    watch: {
        visible: {
            handler(newVal) {
                if (newVal) {
                    this.setStatusBarStyle("dark")
                    setTimeout(() => {
                        this.getListHeight(false)
                    }, 100)
                }
            },
            immediate: true,
        },
    },
    mounted() {
        this.getListHeight()
    },
    onLoad(e) {
        if (e && e.categoryId) {
            this.param.categoryId = Number(e.categoryId)
        }
    },
    onShow() {
        getSupplierCarList().then((res) => {
            this.easyUpSupplierTabBarBadge()
        })
    },
    methods: {
        getListHeight(init = true) {
            //获取商品高度
            getElementHeight(this, ".main", (e) => {
                this.listHeight = e - 54 + "px"
                this.loadOk = true
                if (init) {
                    this.getLocation()
                }
            })
        },
        searchFn(e) {
            this.param.keyword = e
            this.refresh()
        },
        //刷新
        refresh() {
            // this.downRefresh()
            this.fresh = !this.fresh
        },
        //刷新
        downRefresh() {
            this.shopDatas = []
            this.mescroll.resetUpScroll()
        },
        selectFn(item) {
            const eventChannel = this.getOpenerEventChannel()
            eventChannel.emit("getSelectData", {
                ...item,
            })
            this.easyGoBack()
        },
        //获取当前定位地址
        getLocation() {
            getLocation(
                (res) => {
                    if (res) {
                        this.currentCity = res.address.city
                        this.selectCity = res.address.city
                        this.param.address = res.address.city
                        this.param.lat = res.latitude
                        this.param.lng = res.longitude
                        this.$forceUpdate()
                        this.getP(res.address)
                    }
                },
                (error) => {
                    console.log(error)
                    this.currentCity = "定位失败"
                },
            )
        },
        getP(res) {
            let item = {
                ContactAddress: res.street + res.streetNum,
                ProvinceName: res.province,
                CityName: res.city,
                AreaName: res.district,
                StreeName: res.street,
            }
            let list = []
            list.push(item)
            let param = {
                list: list,
            }
            this.batchSmartParse(param)
        },
        //智能识别
        batchSmartParse(param) {
            batchSmartParse(param).then((res) => {
                if (res.Data && res.Data.list && res.Data.list.length > 0) {
                    let result = res.Data.list[0]
                    this.location = result
                    this.param.cityId = result.CityId
                    this.$forceUpdate()
                    this.refresh()
                }
            })
        },
        upFn(data) {
            this.param = data
            this.selectCity = data.address
            this.$forceUpdate()
            this.refresh()
        },
        goDetail(id) {
            this.easyGoTo(`/pages_supplier/packet/supplier/detail?id=${id}`)
        },
    },
}
</script>

<style lang="scss">
.search-bar-box {
    background: $color-white;
    padding: $app-page-padding;
}

.current-lbs {
    background: $color-white;
    padding: 0 $app-page-padding $app-page-padding;
    display: flex;
    flex-direction: column;
    margin-bottom: 20rpx;

    .title {
        font-size: $font-size-28;
        color: $app-color-text-tip;
    }

    .lbs-name {
        font-weight: bold;
        margin-top: 10rpx;
        font-size: $font-size-32;
    }
}
</style>
